<template>
  <div>
    <mavon-editor v-model="content" @change="changeValue"/>
    <mavon-editor v-model="content" :subfield="false"/>
    <el-button type="primary" @click="generationHTML">展示模板</el-button>
    <div class="render"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      content: '![图片](https://acg.xydwz.cn/api/api.php)',
      render: ''
    }
  },
  methods: {
    generationHTML () {
      console.log(this.render)
      document.querySelector('.render').innerHTML = this.render
    },
    changeValue(value, render) {
      this.render = render
    }
  }
}
</script>

<style lang="less" scoped>
  .markdown-body {
    height: 300px;
  }
  .el-button {
    margin-top: 20px;
  }
</style>
